<!--付款页面-->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <script th:src="@{/layui/jquery-3.2.1.min.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery-3.3.1.min.js}" type="text/javascript"></script>
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/font-awesome.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/common.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/local css/index.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/js/bootstrap.min.js}" type="text/javascript"></script>
    <script th:src="@{/layui/layui.js}" type="text/javascript"></script>
    <script th:src="@{/local js/index.js}" type="text/javascript"></script>
    <link th:href="@{/css/jquery-ui.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/js/jquery-ui.js}" type="text/javascript"></script>
    <title>收款台 OnlineMall | 电子商城</title>
    <link rel="shortcut icon" th:href="@{/image/walmart.png}" type="image/x-icon"/>
    <script type="text/javascript">

    </script>
</head>

<body>
<!-- 收款台 -->
<!--包含头部模块-->
<div th:replace="mall/common::head"></div>

<div style="height: 100px">
    <p style="margin-left:400px;font-size: 28px;float: left">收银台</p>
    <img class="b" th:src="@{/image/jstj.jpg}" />
    <span style="font-size: 20px;padding-left: 300px">订单提交成功，请您尽快付款</span>
</div>

<!-- 支付方式选择 -->
<div style="margin-left: 410px;font-size: 22px;font-weight: bold">
        <p>订单号：<span th:text="${order.id}"></span></p>
        <p>订单时间：<span th:text="${#dates.format(order.getOrderTime(),'yyyy-MM-dd HH:mm:ss')}"></span></p>
        <p>收货人：<span th:text="${order.name}"></span></p>
        <p>电话：<span th:text="${order.phone}"></span></p>
        <p>应付金额：<span th:text="${order.total}"></span><i>￥</i></p>
        <p>送货至：<span th:text="${order.addr}"> </span></p>
</div>
<div style="font-size: 25px;margin-left: 410px">
    <p>支付平台</p>
</div>
<ul id="myTab" class="nav nav-tabs" style="margin-left: 530px">
    <li class="active">
        <a href="#home" data-toggle="tab">
            <button> <image th:src="@{/image/zhifubao.png}"/></button>
        </a>
    </li>
    <li>
        <a href="#ios" data-toggle="tab">
            <button><image style="height: 68px;width: 300px" th:src="@{/image/kuaiqian.png}"/></button>
        </a>
    </li>
    <li>
        <a href="#jmeter" data-toggle="tab">
            <button> <image th:src="@{/image/weixinpay.png}"/></button>
        </a>
    </li>
</ul>
<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade in active" id="home" style="font-size: 20px;height: 450px">
            <p style="margin-left: 574px;margin-top: 70px">使用电脑支付</p>
           <p style="margin-left: 1050px;margin-top: -46px">使用支付宝钱包扫一扫即可付款</p>
            <img style="margin-left: 530px;display: block" th:src="@{/image/21.png}"/>
            <a style="margin-left: 600px;padding-top: 20px" th:href="@{'/order/toPayzhifubao.html?id=' + ${order.id}}"><button class="layui-btn layui-bg-blue layui-btn-lg layui-btn-radius layui-btn-danger">立即支付</button></a>
            <img style="margin-left: 150px;margin-top: -220px" th:src="@{/image/23.png}"/>
            <img style="margin-left: 150px;margin-top:-90px" th:src="@{/image/22.png}"/>
    </div>
    <div class="tab-pane fade" id="ios" style="height: 300px">
        <div style="margin-left: 926px;margin-top: 150px"><a href="#"><button class="layui-btn layui-bg-blue layui-btn-lg layui-btn-radius layui-btn-danger">立即支付</button></a>
        </div>
    </div>
    <div class="tab-pane fade" id="jmeter" style="height: 450px">
        <img style="margin-left: 600px;margin-top: 100px" th:src="@{/image/weixin.jpg}"/>
        <p style="margin-left: 1178px;margin-top: -254px">使用微信扫一扫即可付款</p>
        <img style="margin-left: 1184px;margin-top: 46px" th:src="@{/image/24.png}"/>
    </div>
</div>

<!--footer-->
<div th:replace="mall/common::foot"></div>
</body>
</html>

